<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="icon" href="./images/logo.ico">
    <link rel="stylesheet" href="./css/shopDetail.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/layui.css">
    <title>商家详情</title>
</head>
<body>
<!--公共头部-->
<div class="headerwrap clears bord-bott2">
	<div class="headnav">
        <div class="headnav-cent">
            <div class="headnav-left l">
                <p class="headnav-left-download">
                    <span class="headnav-left-img"></span>
                    <span class="headnav-left-text">分享实地圈</span>
                </p>
                <p></p>
            </div>

            <div  class="headnav-right r">
                <ul class="headnav-right-ul r">
                    <li class="show pleaseLogin"><a href="./login.html" class="bordRight1c">您好，请登录</a></li>
                    <li class="hide hasLogin"><a id="username"  class="" href=""></a><span class="line"></span><a class="bordRight1c" id="loginOut" href="">退出</a></li>
                    <li class="hide"><a  class="bordRight1c" href="">返回首页</a></li>
                    <li class="my_sdq"><a class="bordRight1c" href="">我的实地圈<span class="headnav-arrow"></span></a></li>
                    <li class=""><a class="bordRight1c my_collect" href="javascript:void(0)">我的收藏</a></li>
                    <li class="down-app">
                        <span class="headnav-left-img"></span>
                        <span class="headnav-left-text">手机实地圈</span>
                        <span class="headnav-left-arrow"></span>
                        <div class="head-app-down hide">
                            <img src="./images/appcode.png" alt="">
                        </div>
                    </li>
                    <div class="clears"></div>
                </ul>

            </div>
            <div class="clears"></div>
        </div>
    </div>
    <div class="headAdvert show">
        <div class="headAdvert-img">
            <span>X</span>
            <img src="./images/advert.png" alt="">    
        </div>
    </div>
	<div class="pubtopwrap">
		<div class="pubwrap">
			<div class="pubtopcon">
				<div class="logo"></div>
				<div class="changecity">
					<span id="currentCity" class="col333">定位中...</span>
					<a href="javascript:void(0);" class="col37c">切换城市</a>
				</div>
				<div class="pubsearch setbox_s bgfff">
					<div class="searchMenu">
						<div class="searchTab bgfff">
							<ul class="tab-ul">
								<li data-tag="1" class="bgcoff">商品</li>
								<li data-tag="2" class="bgco36">商家</li>
								<li data-tag="3" class="bgcoff">服务</li>
							</ul>
						</div>
						<i></i>
					</div>
					<input type="text" class="searchinp col333" placeholder="请输入商家名">
					<a href="javascript:void(0);" class="searcha colfff bg2fb">搜索</a>
					<div class="nearArea">
                        <ul class="l">
                            <li><a href="">肯德基</a></li>
                            <li><a href="">汤粉</a></li>
                            <li><a href="">KTV</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li class="clears"></li>
                        </ul>
					</div>
				 </div>
				<div class="clears"></div>
			</div>
			<div class="clears"></div>
			<div class="classifynav ">
			      <!--这里显示分类-->
                <div class="cont_body_nav setbox_s l">
                    <ul class="shop_nav">
                        <li class="shop_nav_li l">日用市场</li>
                        
                    </ul>
                    <div class="shop_nav_kid hide">
                        <ul class="nav_kid">
                            <li class="nav_kid_li l">日用市场</li>
                           
                        </ul>
                    </div>
                </div>
				<span class="colfff nav_down">店铺分类<i></i></span>
				
				<ul>
					<li data-links="index" class="link_index jump_links">
						<a href="javascript:void(0);" class="col333">首页</a>
					</li>
					<li data-links="goods" class="link_goods jump_links">
					    <a href="javascript:void(0);" class="col333">商品</a>
					</li>
					<li data-links="shop" class="link_shop jump_links">
						<a href="javascript:void(0);" class="col37c">商家</a>
					</li>
					<li data-links="service" class="link_service jump_links">
						<a href="javascript:void(0);" class="col333 ">服务</a>
					</li>
				</ul>
				<div class="nav-img hide">
				    <img src="./images/appcode.png" alt="">
				</div>
			</div>
		</div>
	</div>
</div>
<!--内容详情-->
<div id="zwl-serviceDetail">
    <div class="service-level">
        <p>
            <span>商家</span>
            <span class="levelr">></span>
            <span class="levelr shop-type">店铺</span>
        </p>
    </div>
    <div class="serviceDetail">
        <div class="service-intro">
              <div class="info">
               <div class="detailsl" id="preview">
                    <div class="jqzoom" id="spec-n1" onClick="">
                    </div>
                <div id="spec-n5">
                    <div class="control" id="spec-left">
                        <img src="ad/left.gif" />
                    </div>
                    <div id="spec-list">
                        <ul class="list-h">
                            <li><img src="ad/img01.jpg"> </li>
                            <li><img src="ad/img02.jpg"> </li>
                        </ul>
                    </div>
                    <div class="control" id="spec-right">
                        <img src="ad/right.gif" />
                    </div>	
                </div>
            </div>
            <div class="intro">
                <p class="name-p">包子店铺</p>
                <p class="intro-detail">兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼职兼职兼职兼职兼职简直兼职兼</p>
                <p class="open-time">
                    <span class="open-name">营业时间：</span>
                    <span class="time">8:00-22:00</span>
                </p>

                <p class="intro-contact">
                    <span class="contact">联系方式：</span>
                    <span class="contact-phone">15874709296</span>
                    <span class="linkman">联系商家</span>
                </p>
                <p class="address">
                    <span class="address-name">地址：</span>
                    <span class="address-addr">湖南省永州市冷水滩区普利桥镇杉木桥村</span>
                </p>
                <span class="intro-collected">
                    <span class="collect-sc"><span class="img"></span><span class="count">收藏量：</span></span>
                    <span class="collect-ll"><span class="img"></span><span class="count">浏览量：</span></span>
                    <span class="collect-log"><span class="img1 un-collect"></span><span class="count1">收藏</span></span></span>
                </span>

                <!--商家服务-->
                <div class="shopService">
                    <div class="shopService-tag">
                        <span class="shopTag">商家服务：</span>
                        <span class="tag">支持配送</span>
                        <span class="tag">手机支付</span>
                        <span class="tag">可开发票</span>
                        <span class="more-l">更多优惠<span class="more-lImg"></span></span>
                    </div>
                    <div class="tagDetail">
                        <p class="tag-detail"><img src="" alt="" class="tagImg"><span class="tag-intro">本店所有商品慢200减50 很优惠</span></p>
                        <p class="tag-detail"><img src="" alt="" class="tagImg"><span class="tag-intro">本店所有商品慢200减50 很优惠</span></p>
                    </div>
                </div>
            </div>
          </div>
            <div class="bar">
               <a href="#shop-pos" class="serviceDetail-name shopName bgf38d"><span>本店商品</span></a>
                <a href="#pro-detail" class="serviceDetail-name shopIntro bgf666"><span>商家介绍</span></a>
                 <a href="#shop-reg" class="serviceDetail-name shopRe bgf666"><span>商家认证</span></a>
            </div>
            <!--本店商品-->
            <span class="biaoti" name="shop-pos" id="shop-pos">本店商品</span>
            <div class="shopping" >
                <ul class="productList">
                    <div class="clears"></div>
                </ul>
            </div>
<!--
            <div class="shop-page">
               <div id="page" class="page" >
               </div>
            </div>
-->
           <span class="biaoti" name="pro-detail" id="pro-detail">商家介绍</span>
           <div class="serviceDetail-intro"></div>
           <span class="biaoti" name="shop-reg" id="shop-reg">商家认证</span>
           <div class="reg-pic">
               <div class="pic-img"></div>
               <div class="pic-img"></div>
               <div class="pic-img"></div>
               <div class="pic-img"></div>
           </div>
           <div class="clears"></div>
        </div>
        <!--猜你喜欢-->
        <div class="guess hide">
            <div class="guess-like">
                <hr class="hr1 ">
                <span>
                 猜你喜欢
                 </span>
                <hr class="hr2 ">
                <div class="guess-pic">
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="page">
                         <span class="forward-b"></span>
                         <span class="forward-t"></span>
                     </div>
                </div>
            </div>

            <div class="guess-like-ta">
                <hr class="hr1 ">
                <span>
                 TA的服务
                 </span>
                <hr class="hr2 ">
                <div class="guess-pic">
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                      <div class="pic-pic"><img src="./images/122.png" alt=""><span>店铺</span></div>
                     <div class="page">
                         <span class="forward-b"></span>
                         <span class="forward-t"></span>
                     </div>
                </div>
            </div>

        </div>
        <div class="clears"></div>
    </div>
</div>
<!--底部-->
<div class="index_footer">
    <div id="zwl-footer">
        <div class="detail ">
            <ul class="detail-ul">
                <li class="detail-li1">
                    <div class="detail-div3">
                        <p class="detail-div-head text-left">用户帮助</p>
                        <a href="#" class="detail-div-son son1">常见问题</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div">
                        <p class="detail-div-head text-right">手机实地圈</p>
                        <a href="#" class="detail-div-son">下载手机版</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div1">
                        <p class="detail-div-head text-right">商户合作</p>
                        <a href="#" class="detail-div-son">友情链接</a>
                        <a href="#" class="detail-div-son">市场合作</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div1">
                        <p class="detail-div-head text-right">公司信息</p>
                        <a href="#" class="detail-div-son text-right">关于实地圈</a>
                        <a href="#" class="detail-div-son text-right">微信公众号</a>
                        <a href="#" class="detail-div-son text-right">新浪微博</a>
                    </div>
                </li>
                <li class="detail-li1 detail-li2">
                    <div>
                        <div class="detail-div2">
                        <p class="detail-div-head text-right head2">联系方式</p>
                        <a href="#" class="detail-div-son text-right">电话：400-886-7938</a>
                        <a href="#" class="detail-div-son text-right">周一至周日:</a>
                        <a href="#" class="detail-div-son text-right">9:00-22:00</a>
                    </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="log">
            ©2016 shidiquan.cn  京ICP证030173号  京公网安备11010802014106号  互联网药品信息
    </div>
</div>
<!--侧边栏选项-->
<div class="index_side">
    <div class="s_div s_back_top">
        <p class="s_wid_back hide">
            <i>回到顶部</i>
            <span></span>
        </p>
        <span class="s_bg s_bg_back hide">
            <span></span>
            <i>
                返回  
                顶部
            </i>
        </span>
    </div>
    <div class="s_div s_down">
        
        <p class="s_wid_down hide">
           <span>扫描二维码</span>
            <img src="./images/appcode.png" alt="">
        </p>
        <span class="s_bg s_bg_down">
            <span></span>
            <i>
               下载
               app
            </i>
        </span>
    </div>
</div>
<!--登录弹出框提示信息-->
<div id="loginBox">
    <div id="loginBody" class="loginBody">
    </div>
    <div class="login">   
        <div class="login-detail">
            <i class="closeBtn"></i>
            <span class="login-log col141 font16">请先登录</span>
            <div class="login-l login-name">
                <div class="login-user l"></div>
                <input placeholder="手机号/实地圈号登录" class="login-input font14 ">
            </div>
            <div class="login-l login-pwd">
                <div class="login-user lr l"></div>
                <input type="password" placeholder="请输入密码" class="login-input font14 ">
            </div>
            <div class="auto">
                <input class="auto-login l" type="checkbox" name="checkbox"  value="login" /> <span class="auto-span a_login l">记住密码</span><span class="auto-span l text-right">忘记密码?</span>
            </div>

            <div class="loginIn colfff ">
                登录
                <div class="error">账号或者密码不能为空!</div>
            </div>
            <span class="download font12 col36c">下载手机APP注册</span>
        </div>
    </div>
</div>
</body>
<script src="./js/jquery-1.7.2.min.js"></script>
<script src="./js/common.js"></script>
<script src="./js/layui.js"></script>
<script src="./js/base.js"></script>
<script src="./js/163css.js"></script>
<script src="./js/lib.js"></script>
<script src="./js/md5.js"></script>
<script src="./js/page/shopDetail.js"></script>
<script src="./js/jqzoom.js"></script>
<script src="./js/jumpPage.js"></script>
<script>
//    layui.use(['laypage', 'layer'], function(){
//      var laypage = layui.laypage
//      ,layer = layui.layer;
//      laypage({
//        cont: 'page',
//          pages: 60,
//          skip: true,
//          first:false,
//          lase:false,
//          jump: function(obj, first){
//            var curr = obj.curr;
//                console.log(curr);
//          }
//      });
//    });    
    
    //------点击改变背景背景颜色-----
$(".serviceDetail-name").on("click",function(){
$(this).addClass("bgf38d").removeClass("bgf666").siblings().addClass("bgf666").removeClass("bgf38d");
});
$(".nav_down").on("click",function(){
    if($(".shop_nav").css("display")=="none"){
        $(".shop_nav").css("display","block");
        $(".classifynav .nav_down i").css("background","url(../images/pubbg.png) no-repeat 0 -168px");
    }else{
        $(".shop_nav").css("display","none");
        $(".classifynav .nav_down i").css("background","url(../images/pubbg.png) no-repeat 0 -120px");
    }

    setAction(".shop_nav",".shop_nav_kid");//服务
});

function setAction(ele,_ele){
    var ele=ele;
    var _ele=_ele;
    $(ele).find("li").on("mouseover",function(){
        var a=$(this).html();
        $(_ele).addClass("show").removeClass("hide");
    });
    $(ele).on({//大类鼠标停留跟移除
        mouseover:function(){
            show_action();
        },
        mouseout:function(){
            hide_action();    
        }
    });
    $(_ele).find(".nav_kid").on({//小类鼠标停留跟移除
        mouseover:function(){
            show_action();
        },
        mouseout:function(){
            hide_action();
        }
    });


    function show_action(){
        $(_ele).addClass("show").removeClass("hide");
    }
    function hide_action(){
        $(_ele).addClass("hide").removeClass("show");
    }
    $(document).on("click",_ele+" ul li",function(){//选择小类并且隐藏，跳转到指定的页面
        $(_ele).addClass("hide").removeClass("show");
        $(ele).css("display","none");
        if($(ele).css("display")=="none"){
//                $(".classifynav .nav_down i").css("background","url(../images/pubbg.png) no-repeat 0 -120px");
        }
        $(".selected").css("display","block");
    }); 
}
/**
 *判断class为bar的div当前位置
 **/
var top_bar=parseInt($(".bar").offset().top);//class为bar的div的位置
getBarPosition();
function getBarPosition(){
    var topWindow=parseInt($(document).scrollTop());
    if(top_bar<=topWindow){
        $(".bar").addClass("scrollBar");
    }else{
        $(".bar").removeClass("scrollBar");
    }
}
$(document).on("scroll",function(e){
    getBarPosition();
});
</script>

</html>